﻿@{
    ViewBag.Title = "示意图";
}

@section scripts{
    <script src="http://api.map.baidu.com/api?v=1.4" type="text/javascript"></script>
    <script>
        $(function () {
            var map = new BMap.Map('map');
            map.centerAndZoom("灵台", 12);
            map.enableScrollWheelZoom(true);

            map.addControl(new BMap.NavigationControl()); 
            
            var sContent =
"<h4 style='margin:0 0 5px 0;padding:0.2em 0'>天安门</h4>" +
"<img style='float:right;margin:4px' id='imgDemo' src='http://app.baidu.com/map/images/tiananmen.jpg' width='139' height='104' title='天安门'/>" +
"<p style='margin:0;line-height:1.5;font-size:13px;text-indent:2em'>天安门坐落在中国北京市中心,故宫的南侧,与天安门广场隔长安街相望,是清朝皇城的大门...</p>" +
"</div>";
            var point = new BMap.Point(107.291954, 35.182524);
            var marker = new BMap.Marker(point);
            var infoWindow = new BMap.InfoWindow(sContent);  // 创建信息窗口对象
            map.centerAndZoom(point, 15);
            map.addOverlay(marker);
            marker.addEventListener("click", function () {
                this.openInfoWindow(infoWindow);
                //图片加载完毕重绘infowindow
                document.getElementById('imgDemo').onload = function () {
                    infoWindow.redraw();
                }
            });

            function showInfo(e) {
                alert(e.point.lng + ", " + e.point.lat);
            }
            map.addEventListener("click", showInfo);

            function getBoundary() {
                var bdary = new BMap.Boundary();
                bdary.get("灵台", function (rs) {       //获取行政区域
                    //map.clearOverlays();        //清除地图覆盖物       
                    var count = rs.boundaries.length; //行政区域的点有多少个
                    for (var i = 0; i < count; i++) {
                        var ply = new BMap.Polygon(rs.boundaries[i], { strokeWeight: 4, strokeColor: "#ff0000", fillColor: '' }); //建立多边形覆盖物
                        map.addOverlay(ply);  //添加覆盖物
                        map.setViewport(ply.getPath());    //调整视野         
                    }
                });

                var polygon = new BMap.Polygon([
                    new BMap.Point(107.079811, 35.161752),
                    new BMap.Point(107.159149, 35.13389),
                    new BMap.Point(107.236188, 35.154669),
                    new BMap.Point(107.291954, 35.182524),
                    new BMap.Point(107.276432, 35.204706),
                    new BMap.Point(107.224114, 35.23726),
                    new BMap.Point(107.137877, 35.208953),
                    new BMap.Point(107.091309, 35.179691)
                ], { strokeColor: "blue", strokeWeight: 2, strokeOpacity: 0 });
                map.addOverlay(polygon);
            }
            setTimeout(function () {
                getBoundary();
            }, 2000);
        });
    </script>
}
<div id="map" style="width: 100%; height: 100%"></div>

